<template>
  <div class="main">
    <div class="section">
      <div class="left">
        <image src='http://fanglilai-pic.oss-cn-shenzhen.aliyuncs.com/mw690/20180611/2018061109524584300.jpg'></image>
        <span>手机号</span>
      </div>
      <div class="right">
        <span>未绑定</span>
        <image src='http://fanglilai-pic.oss-cn-shenzhen.aliyuncs.com/mw690/20180611/2018061109521164553.jpg'></image>
      </div>
    </div>
    <div class="section">
      <div class="left">
        <image src='http://fanglilai-pic.oss-cn-shenzhen.aliyuncs.com/mw690/20180611/2018061109513540216.jpg'></image>
        <span>微信</span>
      </div>
      <div class="right" >
        <button v-if="!bind" class="wx-bind" open-type="getUserInfo" @getuserinfo="getUserInfo">未绑定</button>
        <button v-else class="wx-bind" disabled>已绑定</button>
        <image v-if="!bind" src='http://fanglilai-pic.oss-cn-shenzhen.aliyuncs.com/mw690/20180611/2018061109521164553.jpg'></image>
      </div>
    </div>
  </div>
</template>

<script>
import store from '@/store/store'
import api from '@/utils/api'
export default {
  computed: {
    userList () {
      return store.state.userList
    },
    userInfo () {
      return store.state.userInfo
    }
  },
  data () {
    return {
      logs: [],
      isCurrent: true,
      openid: '',
      bind: false
    }
  },
  onLoad () {
    try {
      var value = wx.getStorageSync('openid')
      if (value) {
        console.log(value)
        this.bind = true
      }
    } catch (e) {
      this.bind = false
      console.log('获取openid失败')
    }
    for (let index in this.userList) {
      if (this.userInfo.cellphone === this.userList[index].account) {
        this.userList[index]['isCurrent'] = true
      } else {
        this.userList[index]['isCurrent'] = false
      }
    }
    console.log(this.userList)
  },
  methods: {
    getUserInfo (e) {
      this.loginWechat(e)
    },
    // 登录微信,获取code
    loginWechat (e) {
      let that = this
      wx.login({
        success: function (res) {
          if (res.code) {
            console.log(res.code)
            that.opbindwechat(res.code, e)
          } else {
            console.log('登录失败！' + res.errMsg)
          }
        }
      })
    },
    // 获取openid和session_key
    opbindwechat (code, e) {
      var param = {}
      param['code'] = code
      param['type'] = 2
      param['xcx_no'] = 22
      const opbindwechat = api.opbindwechat(param)
      opbindwechat.then(d => {
        if (d.code === 200) {
          try {
            wx.setStorageSync('openid', d.data.openid)
          } catch (e) {
          }
          this.opgetuserinfo(e.mp.detail.userInfo, d.data.openid)
        } else {
          console.log('获取失败')
        }
      })
      .catch((e) => {
        console.log(e)
      })
    },
    // 后台存入userInfo和 openid
    opgetuserinfo (userInfo, openid) {
      userInfo['openid'] = openid
      var param = userInfo
      console.log(userInfo)
      const opgetuserinfo = api.opgetuserinfo(param)
      opgetuserinfo.then(d => {
        if (d.code === 200) {
          console.log('保存成功')
          this.bind = true
        } else if (d.code === 4313) {
          this.bind = true
        }
      })
      .catch((e) => {
        console.log(e)
      })
    },
    toSwitch (item) {
      var _this = this
      if (!item.isCurrent) {
        wx.showModal({
          title: '提示',
          content: '切换到该账号?',
          confirmText: '确定',
          cancelText: '取消',
          success: function (res) {
            if (res.confirm) {
              store.commit('setCookie', item.cookie)
              store.commit('setUserInfo', item.userInfo)
              _this.$router.push({ path: '/pages/home/main', isTab: true })
            } else {
            }
          }
        })
      }
    },
    toAddAcc () {
      wx.showModal({
        title: '提示',
        content: '添加/注册账号?',
        confirmText: '确定',
        cancelText: '取消',
        success: function (res) {
          if (res.confirm) {
            wx.reLaunch({
              url: '/pages/accounts/login/main'
            })
          } else {
          }
        }
      })
    }
  }
}
</script>

<style>
@import './binding_accounts.css';
</style>
